<template>
	<view>
		<!-- 列表页 -->
		<view class="">
			<view class="list d-flex mt-2">
				<view class="wrapper flex-column">
					<view class="address-box d-flex">
						<view class="tag">默认</view>
						<view class="address">zhuzhuzhu</view>
					</view>
					<view class="u-box d-flex">
						<view class="name">名字</view>
						<view class="mobile">13434343434</view>
					</view>
				</view>
				<view>
					<image class="image" src="@/static/img/cate/revise.png" mode="widthFix">
				</view>
			</view>
		</view>
		<!-- 空白展示页 -->
		<!-- <view class="white">
		<image src="@/static/img/user/zanwutaitou.png" mode="widthFix" style="width: 188rpx;"/>
			<view>暂无抬头信息</view>
		</view> -->
		<!-- 底部添加按钮 -->
		<view @tap="invoiceCode" class="btn d-flex">
			<view class="center d-flex">
				<image src="@/static/img/user/tianjia.png" mode="widthFix" style="width: 30rpx;" />
				<view class="btnView">添加发票信息</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		},
		methods: {
			invoiceCode() {
				uni.navigateTo({
					url: './invoiceCode'
				})
			}
		},
	}
</script>

<style lang="scss">
	.white {
		margin: 280rpx;
	}

	.btn {
		width: 90%;
		height: 60rpx;
		padding: 20rpx;
		background-color: #e80909;
		color: white;
		position: fixed;
		bottom: 100rpx;
		margin: 0 20rpx;
		border-radius: 100rpx;
		line-height: 60rpx;

		.center {
			margin: 0 auto;

			image {
				margin: 15rpx 10rpx;
			}
		}

		.btnView {}
	}

	page {
		background-color: #f5f5f5;
	}

	.list {
		position: relative;
		align-items: center;
		padding: 20rpx;
		background: #fff;
		width: 90%;
		height: 100%;
		margin: 20rpx auto;
		border-radius: 20rpx;
	}

	.wrapper {
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.address-box {
		display: flex;
		align-items: center;

		.tag {
			font-size: 24upx;
			color: white;
			margin-right: 10upx;
			background: #e80909;
			border-radius: 4upx;
			padding: 10rpx;
			line-height: 1;
		}

		.address {
			font-size: 30rpx;
			color: #303133;
		}
	}

	.u-box {
		font-size: 28rpx;
		color: #909399;
		margin-top: 16rpx;

		.name {
			margin-right: 30rpx;
		}

		.mobile {
			flex: 1;
		}
	}

	.image {
		width: 36rpx;

	}
</style>
